﻿@model MyBlog2.ViewModels.IndexViewModel

@{
    ViewData["Title"] = "※听雨※ 的个人博客-首页";
    Layout = "~/Views/Shared/_Layout.cshtml";
    var pagecount = Model.totalPageCount;       //总页数
    var pageindex = Model.pageIndex;        //主页页码


    //var pagecount = Convert.ToInt32(ViewBag.pageCount);     //总页数
    //var pageindex = Convert.ToInt32(ViewBag.pageIndex);     //主页页码
    var pagestart = pageindex - 2 > 0 ? pageindex - 2 : 1;      //设置开始页码，（共显示5个页码）
    var pageend = pageindex + 2 > pagecount ? pagecount : pagestart + 4;    //设置结束页码
}


<div class="cl-cantainer container">
    <div class="row">
        @* 文章列表 *@
        <div class="col-md-9 cl-left">
            @foreach (var art in Model.Articles)
            {
                <div class="cl-card">
                    <div class="row">
                        <div class="col-lg-12 cl-card-main" style="padding:0 30px 0 30px;line-height:30px;">
                            <h3 class="cl-card-main-title"><a asp-controller="Home" asp-action="Detial" asp-route-id="@art.Id">@art.Title</a></h3>
                            <p class="cl-card-main-info">导读&nbsp; &nbsp; @art.Description</p>
                            <div class="row">
                                <span style="margin-right:25px;color:#999;font-size:14px;">
                                    <img src="@Model.User.Avatar" style="width:24px;height:24px;border-radius:5px;margin:0 0 8px 0;" />
                                    @Model.User.Nickname
                                </span>
                                <span style="margin-right:25px;color:#999;font-size:14px;">
                                    <i class="fa fa-calendar"></i>&nbsp; @art.UpdateTime.ToShortDateString()
                                </span>
                                <span style="margin-right:25px;color:#999;font-size:14px;">
                                    <i class="fa fa-eye"></i>&nbsp;@art.Views
                                </span>

                            </div>

                        </div>
                    </div>
                </div>
            }


            @* 分页 *@
            <nav aria-label="Page navigation">
                <ul class="pagination justify-content-center">
                    <li class="@(pageindex == 1 ? "page-item disabled" : "page-item")">
                        <a class="page-link" aria-label="Previous" asp-controller="Home" asp-action="Index" asp-route-pageIndex="@(pageindex == 1 ? 1 : pageindex - 1)">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                    @for (int i = pagestart; i <= pageend; i++)
                    {
                        <li class="@(pageindex == i ? "page-item active" : "page-item")"><a class="page-link" asp-controller="Home" asp-action="Index" asp-route-pageIndex="@i">@i</a></li>
                    }
                    <li class="@(pageindex == pagecount ? "page-item disabled" : "page-item")">
                        <a class="page-link" aria-label="Next" asp-controller="Home" asp-action="Index" asp-route-pageIndex="@(pageindex == pagecount ? pagecount : pageindex + 1)">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                </ul>
            </nav>

        </div>

        <div class="col-md-3 cl-right">
            @* 关于我 *@
            <div class="right-card">
                <div class="right-card-main">
                    <div class="right-card-title" style="color:#FF9400;">关于我</div>
                    <div class="cl-code">
                        <p>@Model.User.AboutMe</p>
                    </div>

                </div>
            </div>

            @* 文章搜索 *@
            <div class="right-card">
                <div class="right-card-main">
                    <div class="right-card-title" style="color:#FF9400;">文章搜索</div>
                    @* 搜索框 *@
                    <form action="/home/sreach/?" method="get">
                        <div class="input-group mb-3">
                            <input type="text" name="keywords" class="form-control" placeholder="请输入搜索内容..." aria-describedby="button-addon2">
                            <div class="input-group-append">
                                <button class="btn btn-outline-secondary" type="submit">搜索</button>
                            </div>
                        </div>
                    </form>

                </div>
            </div>

            @* 热门标签 *@
            <div class="right-card">
                <div class="right-card-main">
                    <div class="right-card-title" style="color:#FF9400;">热门标签</div>
                    <ul class="label">
                        @foreach (var tag in Model.Tags)
                        {
                            <li><a asp-controller="Home" asp-action="Tag" asp-route-id="@tag.Id">@tag.Name</a></li>
                        }

                    </ul>
                </div>
            </div>

            @* 友链 *@
            <div class="right-card">
                <div class="right-card-main">
                    <div class="right-card-title" style="color:#FF9400;">友链</div>
                    <ul class="right-recommended-list">
                        @foreach (var fl in Model.FriendLinks)
                        {
                            <li>
                                <a href="@fl.Link" target="_blank">
                                    <i class="fa fa-angle-right" aria-hidden="true"></i>
                                    @fl.SiteName
                                </a>
                            </li>
                        }

                    </ul>
                </div>
            </div>

        </div>
    </div>

</div>

@* 底部footer *@
<footer>
    <div class="container-fluid cl-footer">
        <div class="container">
            <p class="cl-copyright">分享更快乐</p>
            <p class="cl-copyright">听雨版权所有</p>
        </div>
    </div>
</footer>
@*<a href="#" class="cd-top">Top</a>*@
<a class="btn btn-default" href="#" role="button" style="position:fixed;right:0;bottom:0;color:rgb(0,181,173)">
    Top
</a>


<script src="highlight/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
